<template>
    <div style="padding: 8px 16px">
        <flexbox justify="flex-end" v-if="detail.pmpProductDetailDTO.isOutsideSystem === '0'">
            <a-button type="primary" @click="handleCreateInfo"> 记录工作 </a-button>
            <a-button type="primary" class="margin-l-8" @click="handleGetJiraInfo" v-if="detail.devType === '2' && detail.issueKey">
                获取jira工时记录
            </a-button>
        </flexbox>
        <a-table rowKey="id" size="small" :loading="loading" :columns="tableColumns" :data-source="list" :pagination="false" class="margin-t-8">
            <template #position="{ record }">
                {{ $filters.valToNameFilter('position', record.position) }}
            </template>
            <template #workType="{ record }">
                {{ getWorkType(record) }}
            </template>
            <template #createTime="{ text }">
                {{ $filters.dateFilter(text) }}
            </template>
            <template #action="{ record }">
                <a @click="handleEdit(record)" v-if="!record.issueKey">编辑</a>
                <a-divider type="vertical" v-if="!record.issueKey" />
                <a @click="handleDelete(record.id, record.workName)">删除</a>
            </template>
        </a-table>
        <create-info ref="createInfoRef" :detail="detail" @success="handleSuccess" />
    </div>
</template>

<script lang="ts">
import api from '@/api';
import store from '@/store';
import { message } from 'ant-design-vue';
import { useMessage } from '@/hooks/common/useMessage';
import CreateInfo from './CreateInfo.vue';
import { defineComponent, ref, unref, reactive, toRefs } from 'vue';
interface State {
    tableColumns: any[];
    loading: boolean;
}
export default defineComponent({
    components: {
        CreateInfo
    },
    props: {
        detail: {
            type: Object,
            default: () => ({})
        },
        list: {
            type: Array,
            default: () => []
        }
    },
    emits: ['success'],
    setup(props, { emit }) {
        const createInfoRef = ref<any>();
        const state = reactive<State>({
            tableColumns: [
                {
                    title: '工作名称',
                    dataIndex: 'workName'
                },
                {
                    title: '岗位',
                    dataIndex: 'position',
                    slots: { customRender: 'position' }
                },
                {
                    title: '工作类型',
                    dataIndex: 'workType',
                    slots: { customRender: 'workType' }
                },
                {
                    title: '预计工时',
                    dataIndex: 'planWorkHours'
                },
                {
                    title: '耗费工时',
                    dataIndex: 'expendWorkHours'
                },
                {
                    title: '记录时间',
                    dataIndex: 'createTime',
                    slots: { customRender: 'createTime' }
                },
                {
                    title: '人员',
                    dataIndex: 'agentUser'
                },
                {
                    title: '操作',
                    dataIndex: 'action',
                    slots: { customRender: 'action' }
                }
            ],
            loading: false
        });
        const handleCreateInfo = () => {
            unref(createInfoRef).open();
        };
        const handleEdit = (record) => {
            unref(createInfoRef).open(record);
        };
        const getWorkType = ({ position, workType }) => {
            const parentTarget = store.getters.dicOptions.position.find((item) => item.code === position);
            if (parentTarget) {
                const target = parentTarget.pmpDictionaryDTOs.find((item) => item.code === workType);
                return target ? target.dimensionName : '';
            }
        };
        const handleGetJiraInfo = async () => {
            const { id, requireSystem, issueKey } = props.detail;
            const query = {
                id,
                requireSystem,
                issueKey
            };
            const { success, errorMsg } = await api.jiraModel.syncWorkLogFromJira([query]);
            if (success) {
                message.success('拉取成功');
                handleSuccess();
            } else {
                message.error(errorMsg);
            }
        };
        const handleDelete = async (id, title: string) => {
            const { createConfirm } = useMessage();
            createConfirm({
                title: `确认删除【${title}】?`,
                iconType: 'danger',
                onOk: async () => {
                    const query = {
                        id
                    };
                    const { success, errorMsg } = await api.productWorkLogModel.delete(query);
                    if (success) {
                        message.success('删除成功');
                        emit('success');
                    } else {
                        message.error(errorMsg);
                    }
                }
            });
        };
        const handleSuccess = () => {
            emit('success');
        };
        return {
            createInfoRef,
            ...toRefs(state),
            handleCreateInfo,
            handleDelete,
            handleSuccess,
            getWorkType,
            handleGetJiraInfo,
            handleEdit
        };
    }
});
</script>

<style scoped></style>
